<!DOCTYPE html>
<html lang="en">
<head>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <title></title>
    <link href="/styles/base.css" rel="stylesheet" type="text/css">

    <link href="/styles/setting.css" rel="stylesheet" type="text/css">
    <#--<link type="text/css" rel="stylesheet" href="/js/plugins/uploadifive/uploadifive.css" />-->
    <script type="text/javascript" src="/js/jquery/jquery.js"></script>
    <script type="text/javascript" src="/js/plugins/jquery-upload/jquery.ui.widget.js"></script>
    <script type="text/javascript" src="/js/plugins/jquery-upload/jquery.iframe-transport.js"></script>
    <script type="text/javascript" src="/js/plugins/jquery-upload/jquery.fileupload.js"></script>

    <#--<script type="text/javascript" src="/js/plugins/uploadifive/jquery.uploadifive.min.js"></script-->>
    <script src="/js/plugins/datepicker/datepicker.js"></script>
    <script src="/js/plugins/jquery-form/jquery.form.js"></script>
    <script type="text/javascript" src="/js/system/setting.js"></script>
    <script type="text/javascript" src="/js/system/common.js"></script>
    <script>
        $(function () {
       /*     //图片上传
            $('.choseCoverBtn').uploadifive({
                'auto' : true,    //自动提交
                'uploadScript' : '/uploadImg',  //图片上传过来处理路径(接受)
                buttonClass:"btn-link",  //按钮的样式
                'fileObjName' : 'pic',  // 图片文件上传之后, 在springmvc 映射方法接受的参数名
                'buttonText' : '浏览...',  //按钮上面文字
                'fileType' : 'image',   //指定上传的图片
                'multi' : false,   //是否为多文件上传, 此处设置单文件
                'fileSizeLimit'   : 5242880,  //文件上传大小
                'removeCompleted' : true, //取消上传完成提示
                'uploadLimit' : 1,  //一次允许上传文件个数
                //'queueSizeLimit'  : 10,  //文件上传等待队列大小
                'overrideEvents': ['onDialogClose', 'onError'],    //onDialogClose 取消自带的错误提示
                'onUploadComplete' : function(file, data) {

                    //data 请求方法处理完之后, 传回来的数据: 约定: 图片的路径(url)
                    $("#imgUrl").attr("src" , "/" + data);
                    $("#coverUrl").val("/" + data);

                },
                onFallback : function() {
                    $.messager.alert("温馨提示","该浏览器无法使用!");
                }
            });*/
            //选择修改头像的按钮
            $("#choseCoverBtn").click(function () {
                $("#inputFile").click();

            })

            $("#inputFile").change(function () {
                if (this.value) {
                    $("#coverForm").ajaxSubmit(function (data) {
                        if (data.success){
                            window.location.reload();
                            // $("#choseCoverBtn").html(" + 重新选择");
                            // $("#coverImage").attr("src", "/" + data.data);
                        }
                    })
                }
            })
        })
    </script>

</head>
<body style="position: relative;">

<div class="topBar">
    <div class="topBarC">
        <div class="logo"><a title="骡窝窝自由行" href="javascript:;">骡窝窝自由行</a></div>
        <div class="t_nav">
            <ul id="pnl_nav" data-cs-t="headnav_wo">
                <li data-cs-p="index">
                    <strong class="t"><a href="/">首页</a></strong>
                </li>
                <li data-cs-t="wenda" data-cs-p="wenda">
                    <strong class="t"><a data-cs-p="from_wo_nav" href="#">问答</a></strong>
                </li>
                <li data-cs-t="things" data-cs-p="things">
                    <strong class="t"><a data-cs-p="from_wo_nav" href="javascript:;">骡窝窝周边</a></strong>
                </li>
                <li data-cs-p="together">
                    <strong class="t"><a href="#">结伴</a></strong>
                </li>
                <li data-cs-p="group">
                    <strong class="t"><a href="#">小组</a></strong>
                </li>
                <li data-cs-p="mall">
                    <strong class="t"><a href="#">蜂首俱乐部</a></strong>
                </li>
                <li class="drop" data-cs-p="other">
                    <strong class="t"><a href="#">更多<b></b></a></strong>
                </li>
            </ul>
        </div>
        <div class="t_search">
            <form method="GET" action="/search/s.php" name="search">
                <input type="text" class="key" value="" name="q" id="word">
                <input type="submit" value="" class="btn">
            </form>
        </div>

        <div class="t_info">
            <div class="pagelet-block">
                <ul class="user_info">
                    <li class="daka">
                            <span class="daka_btn" id="_j_dakabtn" data-japp="daka">
                                <a role="button" title="打卡" class="daka_before">打卡</a>
                                <a role="button" title="打卡推荐" class="daka_after">打卡推荐</a>
                            </span>
                    </li>
                    <li id="pnl_user_msg" data-hoverclass="on" class="msg _j_hoverclass">
                            <span id="oldmsg" class="oldmsg"><a href="javascript:;"
                                                                class="infoItem">消息<b></b></a></span>
                        <ul id="head-msg-box" class="drop-bd">
                            <li><a href="javascript:;" rel="nofollow">私信</a></li>
                            <li><a href="javascript:;" rel="nofollow">小组消息</a></li>
                            <li><a href="javascript:;" rel="nofollow">系统通知</a></li>
                            <li><a href="javascript:;" rel="nofollow">问答消息</a></li>
                            <li><a href="javascript:;" rel="nofollow">回复消息</a></li>
                            <li><a href="javascript:;" rel="nofollow">喜欢与收藏</a></li>
                            <li><a href="javascript:;" rel="nofollow">好友动态</a></li>
                        </ul>
                    </li>

                    <li class="ub-item ub-new-msg" id="head-new-msg">
                    </li>
                    <li class="account _j_hoverclass" data-hoverclass="on" id="pnl_user_set">
                            <span class="t"><a class="infoItem" href="/mine/home"><img
                                            src="${(user.headImgUrl)!}"
                                            width="32" height="32" align="头像"><b></b></a></span>
                        <div class="uSet c">
                            <div class="asset">
                                <a class="coin" href="javascript:;" target="_blank" rel="nofollow">蜂蜜 0</a>
                                /
                                <a class="coin" href="javascript:;" target="_blank" id="head-my-honey"
                                   rel="nofollow" data-cs-p="coin">金币 579</a>
                            </div>
                            <a href="javascript:;">我的骡窝窝<b class="tb-level">LV.3</b></a>
                            <a href="javascript:;" target="_blank">写游记</a>
                            <a href="javascript:;" target="_blank">预约游记</a>
                            <a href="javascript:;" target="_blank">我的足迹</a>
                            <a href="javascript:;" target="_blank">我的问答</a>
                            <a href="javascript:;" target="_blank">我的好友</a>
                            <a href="javascript:;" target="_blank">我的收藏</a>
                            <a href="javascript:;" target="_blank">我的路线</a>
                            <a href="javascript:;" target="_blank">我的订单</a>
                            <a href="javascript:;" target="_blank">我的优惠券</a>
                            <a href="javascript:;" target="_blank">设置</a>
                            <a href="javascript:;">退出</a>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>

<!--文件上传-->
<form action="/mine/uploadImg" method="post" id="coverForm">
    <input type="file" name="pic" id="inputFile" style="display: none;">

</form>


<div class="main">
    <div class="banner">
        <div class="banner_img banner_note" id="_j_banner">
        </div>
        <div class="tags_bar second_tags_bar">
            <div class="center clearfix">
                <div class="MAvatar clearfix">
                    <div class="MAvaImg flt1">
                        <img width="100px" height="100px" src="${(user.headImgUrl)!}">
                    </div>
                    <div class="MAvaEasyWord flt1">
                        <span class="MAvaName">${(user.nickname)!}</span>
                        <span class="MAvaLevel">${(user.level)!}</span>
                    </div>
                </div>
                <ul class="flt2">
                    <li><a class="tags_link" href="/mine/home" title="我的窝">我的窝</a></li>
                    <li><a class="tags_link" href="/mine/travel" title="我的游记">我的游记</a></li>
                    <li><a class="tags_link" href="/mine/review" title="我的点评">我的点评</a></li>
                    <li id="_j_pathnav"><a class="tags_link" href="/mine/travelcollection" title="我的收藏">我的收藏</a>
                    </li>
                    <li><a class="tags_link" href="javascript:;" title="我的订单">我的订单</a></li>
                    <li class="on"><a class="tags_link" href="/mine/setting" title="设置">设置</a></li>
                </ul>
            </div>
        </div>
    </div>
</div>

<div class="wrapper clearfix">
    <div class="aside">
        <a href="/mine/setting"><i class="i1"></i>我的信息</a>
        <a href="/mine/avater" class="on"><i class="i2"></i>我的头像</a>
        <a href="/mine/sns"><i class="i3"></i>绑定设置</a>
        <a href="/mine/security"><i class="i4"></i>账号安全</a>
        <a href="/mine/blacklist"><i class="i9"></i>黑名单管理</a>
        <a href="/mine/wallet"><i class="i10"></i>我的钱包</a>
    </div>

    <div class="content">

        <div class="hd">
            <strong>我的头像</strong>
            <span>
                    资料完善度
                    <div class="progress">
                        <div class="num">85%</div>
                        <div class="on" style="width:85%"></div>
                    </div>
                </span>
        </div>


        <div class="userlogo">
            <div class="avatar" id="_j_avatar_box">

                <form class="forms" action="/mine/avater" method="post" id="infoForm">
                    <input type="hidden" name="_method" value="put">
                    <input type="hidden" name="id" value="${(user.id)!}">
                    <input type="hidden" name="coverUrl" id="coverValue" value="${(user.headImgUrl)!}">
                    <img src="${(user.headImgUrl)!}" id="coverImage" width="120" height="120" border="0">
                </form>
            </div>


            <#-- 上传按钮 -->
            <div class="btn-sub">
                <div class="btn" id="choseCoverBtn" style="position: relative;">选择图片</div>
                支持jpg、png、jpeg、bmp，图片大小5M以内
                <#--  <div id="html5_1dgcdocgi1hp81t5l1qdr7msr73_container" class="moxie-shim moxie-shim-html5" style="position: absolute; top: 0px; left: 0px; width: 120px; height: 36px; overflow: hidden; z-index: 0;">
                  </div>-->
            </div>

            <#--<div id="html5_1dg4gejjbbecinnf001rc69cj3_container" class="moxie-shim moxie-shim-html5" style="position: absolute; top: 0px; left: 0px; width: 120px; height: 36px; overflow: hidden; z-index: 0;"><input id="html5_1dg4gejjbbecinnf001rc69cj3" type="file" style="font-size: 999px; opacity: 0; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%;" accept="image/jpeg,image/png,image/gif"></div></div>-->
            <#--   <div class="editor" id="_j_crop_box">
                   <div class="clearfix">

                       <div class="chose_pic">

                           <span class="choseBtn">+ 选择头像</span>

                       </div>

                       &lt;#&ndash;<div class="preview">&ndash;&gt;
                       &lt;#&ndash;<p>预览</p>&ndash;&gt;
                       &lt;#&ndash;<dl class="small">&ndash;&gt;
                       &lt;#&ndash;<dt><img src="${(user.headImgUrl)!}" width="120px" height="120px"></dt>&ndash;&gt;
                       &lt;#&ndash;<dd>16*16</dd>&ndash;&gt;
                       &lt;#&ndash;</dl>&ndash;&gt;
                       &lt;#&ndash;</div>&ndash;&gt;


                   </div>
                 &lt;#&ndash;  <div class="btns">
                       <a href="#" id="saveBtn">
                           <span>保存</span>
                       </a>

                   </div>
                   <div class="col">
                       <a href="javascript:window.history.go(-1);">
                           <span>取消</span>
                       </a>
                   </div>&ndash;&gt;
               </div>-->
        </div>

    </div>

</div>

<#include "../common/footer.ftl"/>
<div class="mfw-toolbar" id="_j_mfwtoolbar" style="display: block;">
    <div class="toolbar-item-top" style="display: none;">
        <a role="button" class="btn _j_gotop">
            <i class="icon_top"></i>
            <em>返回顶部</em>
        </a>
    </div>
    <div class="toolbar-item-feedback">
        <a role="button" data-japp="feedback" class="btn">
            <i class="icon_feedback"></i>
            <em>意见反馈</em>
        </a>
    </div>
    <div class="toolbar-item-code">
        <a role="button" class="btn">
            <i class="icon_code"></i>
        </a>
        <a role="button" class="mfw-code _j_code">


            <img src="https://p1-q.mafengwo.net/s1/M00/6C/51/wKgIC1t_6TuASybrAADGUPUHjr021.jpeg?imageMogr2%2Fthumbnail%2F%21450x192r%2Fgravity%2FCenter%2Fcrop%2F%21450x192%2Fquality%2F90"
                 width="450" height="192">
        </a>
        <!--<div class="wx-official-pop"><img src="http://images.mafengwo.net/images/qrcode-weixin.gif"><i class="_j_closeqrcode"></i></div>-->
    </div>

</div>
</body>

</html>